
import '../style.css'

export default function OrgSwiper() {
  const items = [
    'Item 1',
    'Item 2',
    'Item 3',
    'Item 4',
    'Item 5',
    'Item 6',
    'Item 7',
    'Item 8',
    'Item 9',
    'Item 10',
    'Item 11',
    'Item 12',
    'Item 13',
    'Item 14',
    'Item 15',
    'Item 16',
    'Item 17',
    'Item 18',
  ];

  return (
    <div className='org-swiper relative h-16'>
      <div className="before h-full"></div>
      <div className="after h-full"></div>
      <div className="overflow-hidden whitespace-nowrap h-full">
        <div className="flex items-center animate-orgSwiper h-full">
          {items.map((item, index) => (
            <div
              key={index}
              className="bg-blue-100 text-blue-700 m-2 rounded-lg flex-shrink-0 w-1/6 h-full flex items-center justify-center"
            >
              {item}
            </div>
          ))}
        </div>
      </div>
    </div>
  );
}
